<template>
	<view class="article-box m-b-25">
		<view class="title-box" v-if="props.data.list[0].title">
			<view class="title-icon">
				<text class="tit">{{ props.data.list[0].title }}</text>
			</view>
			<coreshop-view-more @hanldeClickViewMore="hanldeClickViewMore" title="查看详情" />
		</view>
		<view class="m-t-25" v-for="item, index in props.data.list" :key="index">
			<coreshop-article :data="hanldeCombinationArticleData(item)"
				@handleClickArticle="handleClickArticle"></coreshop-article>
		</view>
	</view>
</template>
<script setup lang="ts">
	import { handleRouteNavigateTo } from '@/core/utils';

	const props = withDefaults(defineProps<{
		data : any,
	}>(), {
		data: {}
	});

	const hanldeCombinationArticleData = (item : any) => {
		return {
			id: item.id,
			title: item.title,
			image: item.coverImage,
			brief: item.brief,
		}
	}

	const hanldeClickViewMore = () => {
		handleRouteNavigateTo(`/pages/subpackage/article/detail/detail?id=${props?.data?.list[0]?.id}`)
	}

	const handleClickArticle = (id : any) => {
		handleRouteNavigateTo(`/pages/subpackage/article/detail/detail?id=${id}`);
	}
</script>
<style lang="scss" scoped>
	@import './home-article.scss';
</style>